<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>register</title>
    <script type="text/javascript" src="./jquery.min.js"></script>
    <script>


        $(function () {
            $("#register").click(function(){
                    var email = $("#email").val();
                    var password = $("#password").val();
                    var code = $("#code").val();
                    var url = 'http://www.test.com/api/user/register/' + email + "/" + password + "/" + code;
                    $.ajax({
                        url: url,
                        type: 'GET',
                        contentType: 'application/json;charset=utf-8',
                        success: function (data) {
                            alert(data);
                            if (data === "注册成功"){
                                window.location.href = "http://www.test.com/static/login.html";
                            }
                        },
                        error: function (err) {
                            alert(err);
                        }
                    })
                }

            )

            $("#getCode").click(function () {
                var email = $("#email").val();
                var url = 'http://www.test.com/api/code/create/' + email;
                $.ajax({
                    url: url,
                    type: 'GET',
                    contentType: 'application/json;charset=utf-8',
                    dataType: 'json',
                    success: function (data) {

                    }
                })
            })

        })
    </script>
    <style type="text/css">
        html{
            width: 100%;
            height: 100%;
            overflow: hidden;
            font-style: sans-serif;
        }
        body{
            width: 100%;
            height: 100%;
            font-family: 'Open Sans',sans-serif;
            margin: 0;
            background-color: #4A374A;
        }
        #login{
            position: absolute;
            top: 50%;
            left:50%;
            margin: -150px 0 0 -150px;
            width: 300px;
            height: 300px;
        }
        #login h1{
            color: #fff;
            text-shadow:0 0 10px;
            letter-spacing: 1px;
            text-align: center;
        }
        h1{
            font-size: 2em;
            margin: 0.67em 0;
        }
        input{
            width: 278px;
            height: 18px;
            margin-bottom: 10px;
            outline: none;
            padding: 10px;
            font-size: 13px;
            color: #fff;
            text-shadow:1px 1px 1px;
            border-top: 1px solid #312E3D;
            border-left: 1px solid #312E3D;
            border-right: 1px solid #312E3D;
            border-bottom: 1px solid #56536A;
            border-radius: 4px;
            background-color: #2D2D3F;
        }
        .but{
            width: 300px;
            min-height: 20px;
            display: block;
            background-color: #4a77d4;
            border: 1px solid #3762bc;
            color: #fff;
            padding: 9px 14px;
            font-size: 15px;
            line-height: normal;
            border-radius: 5px;
            margin: 0;
        }
    </style>
</head>
<body>
<div id="login">
    <h1>注册</h1>
    <input type="text" required="required" placeholder="邮箱" name="u" id = "email"/>
    <input type="password" required="required" placeholder="密码" name="p" id="password"/>
    <input type="password" required="required" placeholder="确认密码" name="u"/>
    <input type="text" required="required" placeholder="验证码" name="u" id="code"/><a id="getCode" style="color: green">获取验证码</a>
    <button class="but" type="submit" id="register">注册</button>
</div>
</body>
</html>